<template>
  <div class="container">
    <div class="container-1200">
      <div class="title mg-B20">审核项目活动资料</div>
      <div>
        <el-row class="rowBorder rowTopBorder">
          <el-col :span="4" class="col-flex bg-ccc">活动名称</el-col> 
         <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">{{ projectActivityForm.activityName }}</el-col>
          <el-col :span="4" class="col-flex bg-ccc">级别(国际/国/省/市)</el-col> 
         <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 ">{{ 
           jbFormate(projectActivityForm.jb) }}</el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="4" class="col-flex bg-ccc">活动主题</el-col>
         <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">{{ projectActivityForm.activityTitle }}</el-col>
          <el-col :span="4" class="col-flex bg-ccc">活动时间</el-col>
         <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 ">{{ projectActivityForm.activityDate }}</el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="4" class="col-flex bg-ccc">举办单位</el-col>
         <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">{{ projectActivityForm.company }}</el-col>
          <el-col :span="4" class="col-flex bg-ccc">项目名称</el-col>
         <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 ">{{ projectActivityForm.projectName }}</el-col>
        </el-row>
        <el-row class="rowBorder">
          <el-col :span="4" class="col-flex bg-ccc">活动地点</el-col>
         <el-col :span="20" class="col-flex colLeftBorder leftAlign-pd30">
           {{projectActivityForm.address}}
         </el-col>
        </el-row>
        <!-- <el-row class="rowBorder">
          <el-col :span="4" class="col-flex bg-ccc">活动状态</el-col>
         <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 colRightBorder">{{ projectActivityStatusFormate(projectActivityForm.status) }}</el-col>
          <el-col :span="4" class="col-flex bg-ccc">驳回说明</el-col>
         <el-col :span="8" class="col-flex colLeftBorder leftAlign-pd30 ">{{ projectActivityForm.memo }}</el-col>
        </el-row> -->
        <el-row class="rowBorder bg-ccc">
          <el-col :span="4" class="col-flex ">相关资料</el-col>
          <el-col :span="20" class="col-flex colLeftBorder leftAlign-pd30 leftAlign-pd30 bg-fff">
            <div style="margin:10px">
                <!-- <el-image fit="contain"
                  style="width: 100px; height: 100px"
                  :src="projectActivityForm.meta.first"
                >
                </el-image> -->
                <img style="width: 100px; height: 100px" :src="projectActivityForm.meta.first"/>
                <div class="flexWithJusCenter">
                   <el-link :href="projectActivityForm.meta.first" target="_blank" type="primary" class="link">活动主题图</el-link> 
                   </div>
              </div>

              <div style="margin:10px">
                <!-- <el-image fit="contain"
                  style="width: 100px; height: 100px"
                  :src="projectActivityForm.meta.second"
                >
                </el-image> -->
                <img style="width: 100px; height: 100px" :src="projectActivityForm.meta.second"/>
                <div class="flexWithJusCenter">
                   <el-link :href="projectActivityForm.meta.second" target="_blank" type="primary" class="link">领导讲话图</el-link> 
                   </div>
              </div>

              <div style="margin:10px">
                <!-- <el-image fit="contain"
                  style="width: 100px; height: 100px"
                  :src="projectActivityForm.meta.third"
                >
                </el-image> -->
                <img style="width: 100px; height: 100px" :src="projectActivityForm.meta.third"/>
                <div class="flexWithJusCenter">
                   <el-link :href="projectActivityForm.meta.third" target="_blank" type="primary" class="link">参会人员图</el-link> 
                   </div>
              </div>
            </el-col>
          </el-row>
      </div>
      <div class="mg-T20">
        <el-form
          :model="auditForm"
          :rules="auditFormRules"
          ref="auditForm"
          label-width="80px"
          class="demo-ruleForm"
        >
          <el-form-item label="驳回说明" prop="memo" v-if="type == 'audit'">
            <el-input type="age" v-model="auditForm.memo"></el-input>
          </el-form-item>
          <el-form-item v-if="type == 'audit'">
            <el-button type="primary" @click="adopt('auditForm')"
              >审核通过</el-button
            >
            <el-button type="danger" @click="reject('auditForm')"
              >审核驳回</el-button
            >
          </el-form-item>
          <el-form-item v-if="type == 'edit'">
            <el-button type="primary" @click="adoptEdit('auditForm')"
              >同意订正</el-button
            >
            <el-button type="danger" @click="rejectEdit('auditForm')"
              >订正驳回</el-button
            >
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
import SingleUpload from "@/components/Upload/singleUpload";
import fileUpload from "@/components/Upload/fileUpload";
import { find as companyFind } from "@/api/adminCompany";
import { list as dictList } from "@/api/dict";
import utils from "@/utils/utils.js";
import { validPhone, validPositiveIntAndZero } from "@/utils/validate.js";
import { find as projectFind } from "@/api/adminProject";
import { update as projectActivityUpdate, find as projectActivityFind,adopt as projectActivityAdopt,
  reject as projectActivityReject, } from "@/api/adminProjectActivity";

export default {
  components: { SingleUpload, fileUpload },
  name: "projectActivityAudit",
  data() {
    const validateCapital = (rule, value, callback) => {
      if (utils.isNull(value)) {
        callback();
      } else if (!validPositiveIntAndZero(value)) {
        callback(new Error("必须为大于等于0的数值"));
      } else {
        callback();
      }
    };
    var alidateMemo = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入驳回说明"));
      } else {
        callback();
      }
    };
    return {
      meta:{},
      projectActivityForm: {
        projectId: "", //所属项目',
        projectName: "", //项目名称',
        jb: "", //级别(国际/国/省/市)',
        activityName: "", //活动名称',
        activityTitle: "", //活动主题',
        activityDate: "", //活动时间',
        address: "", //活动地点',
        company: "", //举办单位',
        meta: "", //相关资料（横幅、台上、台下）[{name:,url:}]',
        companyId: "", //
      },
      projectActivityRules: {
        projectName: [
          { required: true, message: "请输入项目名称", trigger: "blur" },
        ],
        jb: [
          { required: true, message: "请选择级别", trigger: "blur" },
        ],
        activityName: [
          { required: true, message: "请输入活动名称", trigger: "blur" },
        ],
        activityDate: [
          { required: true, message: "请选择活动时间", trigger: "blur" },
        ],
      },

      projectId: "",
      projectInfo: {},
      companyId: "",

      jbDict: [],
      jbPromise:"",
      projectActivityStatusDict:[],
      projectActivityStatusPromise:"",

      //审核表单
      auditForm: {
        memo: "", //驳回说明
      },
      auditFormRules: {
        memo: [{ validator: alidateMemo, trigger: "blur" }],
      },

      //类型
      type:"",

      path: "",
    };
  },
  watch: {
    $route: {
      handler: function (route) {
        this.path = route.path
      },
      immediate: true,
    },
  },

   activated() {
     console.log("activated执行了--", this.$store.getters.closeAliveName,);
    if (this.$store.getters.closeAliveName == "projectActivityAudit") {
      if(this.projectActivityId != this.$route.query.projectActivityId || this.type != this.$route.query.type){
      console.log("activated执行了111--", this.$store.getters.closeAliveName,);
      this.auditForm.memo = ""
      this.type = this.$route.query.type
      this.projectActivityId = this.$route.query.projectActivityId;
      this.projectActivityFind(this.projectActivityId);
      }
        this.$store.dispatch("user/cleanCloseAliveName");
    }
  },

  created() {
    this.jbPromise = utils.getDictList("jb", (res) => {
      this.jbDict = res.data;
    });
    this.projectActivityStatusPromise = utils.getDictList("projectActivity_status", (res) => {
      this.projectActivityStatusDict = res.data;
    });
    if (this.$route.query) {
      this.projectActivityForm.companyId = this.companyId =
        this.$route.query.companyId;
      this.projectActivityForm.projectId = this.projectId =
        this.$route.query.projectId;
        this.projectActivityId  =
        this.$route.query.projectActivityId;
        this.type = this.$route.query.type
        this.projectFind(this.projectId)
      
    }
  },

  mounted() {
    Promise.all([this.jbPromise, this.projectActivityStatusPromise]).then(
      (res) => {
        //console.log("字典已经全部加载完成--");
        this.projectActivityFind(this.projectActivityId);
      }
    );
  },

  destroyed() {},

  methods: {
    //获取活动信息
    projectActivityFind(id) {
      projectActivityFind(id).then((res) => {
        console.log("获取活动信息--", res);
        if (res.type == "success") {
          
          this.projectActivityForm = res.data.projectActivity;
          if(!utils.isNull(res.data.projectActivity.meta)){
            this.projectActivityForm.meta = JSON.parse(res.data.projectActivity.meta)
          }
          this.projectActivityForm.createDate = utils.dateFormatter(this.projectActivityForm.createDate)
          this.projectActivityForm.activityDate = utils.dateFormatter(this.projectActivityForm.activityDate)
        }
      });
    },

    //获取公司信息
    companyFind(id) {
      companyFind(id).then((res) => {
        console.log("获取公司信息res--", res);
        if (res.type == "success") {
          this.projectActivityForm = res.data.company;
        }
      });
    },

     //企业审核
    adopt(Form) {
      let params = new URLSearchParams();
      params.append("projectActivityId", this.projectActivityId);
      projectActivityAdopt(params).then((res) => {
        console.log("企业的审核通过--", res);
        if (res.type == "success") {
          this.$message.success("企业的审核通过");
          this.$store.dispatch("user/setCloseView", this.path)
          this.$router.push({
            path: "/projectActivity/auditList",
            query: { projectId: this.projectId },
          });
        }
      });
    },

    //审核驳回
    reject(formName) {
      this.$refs[formName].validate((valid) => {
        console.log("valid--", valid);
        if (valid) {
          let params = new URLSearchParams();
          params.append("projectActivityId", this.projectActivityId);
          params.append("rejectText", this.auditForm.memo);
          projectActivityReject(params).then((res) => {
            console.log("企业的驳回--", res);
            if (res.type == "success") {
              this.$message.success("企业的审核已经驳回");
              this.$store.dispatch("user/setCloseView", this.path)
              this.$router.push({
                path: "/projectActivity/auditList",
                query: { projectId: this.projectId },
              });
            }
          });
        }
      });
    },

    //获取项目信息
    projectFind(id) {
      let _this = this
      projectFind(id).then((res) => {
        console.log("获取项目信息--", res);
        if (res.type == "success") {
          _this.projectInfo = res.data.project;
          _this.projectActivityForm.projectName = res.data.project.projectName;
        }
      });
    },

    adoptEdit(){
      this.projectActivityForm.meta = JSON.stringify(this.projectActivityForm.meta)
      this.projectActivityForm.status = 0
      projectActivityUpdate(this.projectActivityForm).then((res) => {
            console.log("统一订正--", res);
            if (res.type == "success") {
              this.$message.success("项目活动的订正申请已经同意");
              this.$store.dispatch("user/setCloseView", this.path)
              this.$router.push({
                path: "/projectActivity/auditList",
              });
            }
          });
    },

    rejectEdit(){
      this.projectActivityForm.meta = JSON.stringify(this.projectActivityForm.meta)
      this.projectActivityForm.status = 2
      projectActivityUpdate(this.projectActivityForm).then((res) => {
            console.log("企业的驳回--", res);
            if (res.type == "success") {
              this.$message.success("项目活动的订正申请已经驳回");
              this.$store.dispatch("user/setCloseView", this.path)
              this.$router.push({
                path: "/projectActivity/auditList",
              });
            }
          });
    },

    //表单提交事件
    onSubmit(formName) {
      let _this = this
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if(_this.meta.length > 0){
            _this.projectActivityForm.meta = JSON.stringify(_this.meta)
          }else{
            _this.projectActivityForm.meta = ""
          }
          projectActivityUpdate(this.projectActivityForm)
            .then((res) => {
              console.log("projectActivitySave--", res);
              if (res.type == "success") {
                this.$message.success("更新项目活动成功");
                this.$router.push({
                  path: "/projectActivity/list",
                  query: {
                    companyId: this.companyId,
                    projectId: this.projectId,
                  },
                });
              }
            })
            .catch((err) => {
              this.$message.error(err.msg);
            });
        }
      });
    },

    back(){
      this.$router.go(-1)
    },

    jbFormate(data) {
      return utils.selectDictLabel(this.jbDict, data);
    },

    projectActivityStatusFormate(data) {
      return utils.selectDictLabel(this.projectActivityStatusDict, "projectActivity_status-" + data);
    },

  },
};
</script>

<style lang="scss" scoped>

</style>
